$(function () {

    $('.searchtab li').click(function () {
        //$(this).addClass('current').siblings().removeClass('current');
        $(this).addClass('tab-selected').siblings().removeClass('tab-selected');
        $(this).parents('.searchtab').siblings('.searchbar').eq($(this).index()).show().siblings('.searchbar').hide();

    })
    $('.show-nav li').click(function () {
        $(this).addClass('active').siblings().removeClass('active');
        $(this).parents('.show-nav').siblings('.show-image').children('li').eq($(this).index()).stop().fadeIn(500).siblings('li').stop().fadeOut(500);
    })
    $('.pi,span').click(function () {
        $(this).addClass('pg-current').siblings().removeClass('pg-current');
    })
    $('.pi,.tn-nav-new').click(function () {
        $('.tn-list').fadeOut().siblings('.tn-list1').fadeIn();
        $('body,html').stop().animate({
            scrollTop: 780
        }, 1000)
    })
    $('.m-pagination span:odd,.active').click(function () {
        $('.tn-list1').fadeOut().siblings('.tn-list').fadeIn();
    })

});

(function () {
    //实例化对象
    var myChart = echarts.init(document.querySelector(".asidebox-bd1"));
    // 指定配置项和数据
    var option = {
        tooltip: {
            trigger: "item",
            formatter: "{a} <br/>{b} : {c} ({d}%)"
        },
        color: [
            "#006cff",
            "#60cda0",
            "#ed8884",
            "#ff9f7f",
            "#0096ff",
            "#9fe6b8",
            "#32c5e9",
            "#1d9dff"
        ],
        series: [
            {
                name: "点位统计",
                type: "pie",
                // 如果radius是百分比则必须加引号
                radius: ["10%", "70%"],
                center: ["50%", "50%"],
                roseType: "radius",
                data: [

                    { value: 66, name: "北京" },
                    { value: 60, name: "南京" },
                    { value: 58, name: "西安" },
                    { value: 56, name: "山东" },
                    { value: 55, name: "河北" },
                    { value: 50, name: "江苏" },
                    { value: 49, name: "浙江" },
                    { value: 45, name: "四川" },
                    { value: 42, name: "湖北" },
                    { value: 30, name: "安徽" },

                ],
                // 修饰饼形图文字相关的样式 label对象
                label: {
                    fontSize: 10
                },
                // 修饰引导线样式
                labelLine: {
                    // 连接到图形的线长度
                    length: 6,
                    // 连接到文字的线长度
                    length2: 8
                }
            }
        ]
    };

    // 3. 配置项和数据给我们的实例化对象
    myChart.setOption(option);
    // 4. 当我们浏览器缩放的时候，图表也等比例缩放
    window.addEventListener("resize", function () {
        // 让我们的图表调用 resize这个方法
        myChart.resize();
    });
})();
// 轮播图
(function () {
    window.addEventListener('load', function () {
        var asidebox_bd = document.querySelector('.asidebox-bd');
        var slide_ul = document.querySelector('.slide-ul');
        // var asideboxWidth = asidebox_bd.offsetWidth;
        var asideboxWidth = 260;

        var slide_ol = document.querySelector('.slide-ol');
        var lis = slide_ol.querySelectorAll('li');
        slide_ul.addEventListener('mouseenter', function () {
            clearInterval(timer);
            timer = null; // 清除定时器变量
        });
        slide_ul.addEventListener('mouseleave', function () {
            timer = setInterval(function () {
                slide_ul.click();
            }, 3000);
        });
        for (var j = 0; j < lis.length; j++) {
            lis[j].addEventListener('click', function () {
                for (var i = 0; i < slide_ol.children.length; i++) {
                    slide_ol.children[i].className = '';
                }
                this.className = 'active';
                var index = this.getAttribute('data-id');
                num = index;
                circle = index;
                animate(slide_ul, -index * asideboxWidth)
            })
        }
        slide_ol.children[0].className = 'active';
        var first = slide_ul.children[0].cloneNode(true);
        slide_ul.appendChild(first);

        var flag = true;
        var num = 0;
        var circle = 0;
        slide_ul.addEventListener('click', function () {
            if (flag) {

                if (num == slide_ul.children.length - 1) {
                    slide_ul.style.left = 0;
                    num = 0;
                }
                num++;
                animate(slide_ul, -num * asideboxWidth, function () {
                    flag = true; // 打开节流阀
                });
                circle++;
                if (circle == slide_ol.children.length) {
                    circle = 0;
                }
            }
            circleChange();
        })
        function circleChange() {

            for (var i = 0; i < slide_ol.children.length; i++) {
                slide_ol.children[i].className = '';
            }
            // 留下当前的小圆圈的current类名
            slide_ol.children[circle].className = 'active';
        }
        var timer = setInterval(function () {
            //手动调用点击事件
            slide_ul.click();

        }, 3000);
    })


})();